<!DOCTYPE html>
<html xmlns="http://www.w3.org/1999/xhtml"
      xmlns:th="http://www.thymeleaf.org"
      xmlns:sec="http://www.thymeleaf.org/thymeleaf-extras-springsecurity4">
<head th:replace="commonJS::commonJsCss('合同用户管理')">
    <title>合同用户管理</title>
</head>
<body ng-app="contractUserApp" ng-controller="contractUserCtrl" ng-init="init()">
<!--通用头部-->
<div th:replace="head::header" ></div>
<div th:replace="menu::menu" ></div>
<div  style="height:91%;">
    <div class="form-table" style="width: 88%;min-height: 663px;height: 100%">
        <table class="div_form_table">
            <tr>
                <td class="div_form_middle_title" style="text-align: left;">
                    <button class="form-btn-insert" data-ng-click="toEditContractUser('1')" data-ng-show="isSuperAdmin">新增</button>
                    <button class="form-btn-edit" data-ng-click="toEditContractUser('2')" data-ng-show="isSuperAdmin">编辑</button>
                    <button class="form-btn-delete" data-ng-click="deleteContractUser()" data-ng-show="isSuperAdmin">删除</button>
                </td>
                <td class="div_form_middle_other" style="text-align: right;">
                    <button class="form-btn-cancel" data-ng-click="toAssociatedUsers()" style="width: 90px;">关联用户</button>
                    <button class="form-btn-cancel" data-ng-click="toBillingRange()" style="width: 90px;">计费范围</button>
                    <button class="form-btn-cancel" data-ng-click="toBillingRule()" style="width: 90px;">计费规则</button>
                </td>
            </tr>
        </table>

        <div class="efbtable-no-search">
            <!--页面标题+公司-->
            <div class="form-title-div" style="width: 17%">
                <span class="form-title">合同用户管理</span>
                <span data-ng-show="false" id="span_superAdmin" sec:authentication="principal.superAdmin"></span>
            </div>

            <!--树形结构-->
            <div class="well billingrule_well_div" style="margin-bottom: 0px;">
                <ul id="contractUserTree" class="ztree billingrule_ztree_ul"></ul>

                <div class="modal fade" tabindex="-1" role="dialog" id="editContractUserModal">
                    <div class="modal-dialog" role="document">
                        <div class="modal-content">
                            <div class="modal-header modal-header-efb">
                                <button type="button" class="close" data-dismiss="modal" aria-label="Close"><span aria-hidden="true">&times;</span></button>
                                <h4 class="modal-title modal-title-efb">合同用户管理</h4>
                            </div>
                            <div class="modal-body">
                                <div class="row-fluid">
                                    <div class="span12">
                                        <input type="text" data-ng-show="false" id="contractUserId" data-ng-model="contractUserObject.contractUserId" value=""/>
                                        <table class="div_form_table">
                                            <tr>
                                                <td class="div_form_middle_title">
                                                    用户简称<span class="required-field-mark">*</span>
                                                    &nbsp;&nbsp;:&nbsp;&nbsp;
                                                </td>
                                                <td class="div_form_middle_other">
                                                    <input type="text" id="userAbbrev" name="userAbbrev" data-ng-model="contractUserObject.userAbbrev" maxlength="40" style="width:50%;" required/>
                                                </td>
                                            </tr>
                                            <tr>
                                                <td class="div_form_middle_title">
                                                    用户全称&nbsp;&nbsp;:&nbsp;&nbsp;
                                                </td>
                                                <td class="div_form_middle_other">
                                                    <input type="text" id="userFullname" name="userFullname" data-ng-model="contractUserObject.userFullname" maxlength="200" style="width:50%;"/>
                                                </td>
                                            </tr>
                                            <tr>
                                                <td class="div_form_middle_title">
                                                    类型<span class="required-field-mark">*</span>
                                                    &nbsp;&nbsp;:&nbsp;&nbsp;
                                                </td>
                                                <td class="div_form_middle_other">
                                                    <select id="userTypeSel" name="userType" data-ng-model="contractUserObject.userType" style="width:50%;" required>
                                                        <option value="0" data-ng-selected="contractUserObject.userType == '0'"><--请选择&ndash;&gt;</option>
                                                        <option value="2" data-ng-selected="contractUserObject.userType == '2'">航司</option>
                                                        <option value="1" data-ng-selected="contractUserObject.userType == '1'">机场</option>
                                                    </select>
                                                </td>
                                            </tr>
                                            <tr>
                                                <td class="div_form_middle_title">
                                                    责任人&nbsp;&nbsp;:&nbsp;&nbsp;
                                                </td>
                                                <td class="div_form_middle_other">
                                                    <input type="text" id="personLiable" name="personLiable" data-ng-model="contractUserObject.personLiable" maxlength="40" style="width:50%;"/>
                                                </td>
                                            </tr>
                                            <tr>
                                                <td class="div_form_middle_title">
                                                    手机&nbsp;&nbsp;:&nbsp;&nbsp;
                                                </td>
                                                <td class="div_form_middle_other">
                                                    <input type="text" id="mobilephone" name="mobilephone" data-ng-model="contractUserObject.mobilephone" maxlength="40" style="width:50%;"/>
                                                </td>
                                            </tr>
                                            <tr>
                                                <td class="div_form_middle_title">
                                                    电话&nbsp;&nbsp;:&nbsp;&nbsp;
                                                </td>
                                                <td class="div_form_middle_other">
                                                    <input type="text" id="telephone" name="telephone" data-ng-model="contractUserObject.telephone" maxlength="40" style="width:50%;"/>
                                                </td>
                                            </tr>
                                            <tr>
                                                <td class="div_form_middle_title">
                                                    邮件&nbsp;&nbsp;:&nbsp;&nbsp;
                                                </td>
                                                <td class="div_form_middle_other">
                                                    <input type="text" id="mail" name="mail" data-ng-model="contractUserObject.mail" maxlength="50" style="width:50%;"/>
                                                </td>
                                            </tr>
                                            <tr>
                                                <td class="div_form_middle_title">
                                                    邮编&nbsp;&nbsp;:&nbsp;&nbsp;
                                                </td>
                                                <td class="div_form_middle_other">
                                                    <input type="text" id="postcode" name="postcode" data-ng-model="contractUserObject.postcode" maxlength="6" oninput="this.value=this.value.replace(/\D/g,'')" style="width:50%;"/>
                                                </td>
                                            </tr>
                                            <tr>
                                                <td class="div_form_middle_title">
                                                    地址&nbsp;&nbsp;:&nbsp;&nbsp;
                                                </td>
                                                <td class="div_form_middle_other">
                                                    <input type="text" id="address" name="address" data-ng-model="contractUserObject.address" maxlength="100" style="width:50%;"/>
                                                </td>
                                            </tr>
                                        </table>
                                    </div>
                                </div>
                            </div>
                            <div class="modal-footer modal-footer-efb">
                                <button type="button" class="form-btn-edit" data-ng-click="editContractUser()">确定</button>
                                <button type="button" class="form-btn-cancel" data-ng-click="closeContractUserModal()">取消</button>
                            </div>
                        </div>
                    </div>
                </div>
            </div>
            <!--表格+条件查询+关联+分页-->
            <div id="div_billingrule_table" class="billingrule_table_div" style="margin-top: -42px;display: none;">
                <div class="form-table" style="margin: 3px;" data-ng-show="contractUserEntityVO != null">
                    <!--条件查询+关联-->
                    <div class="efb-form-group">
                        <table class="div_form_table">
                            <tr>
                                <td class="div_form_middle_title" style="width: 10%">用户简称：</td>
                                <td class="div_form_middle_other">
                                    <label>{{contractUserEntityVO.userAbbrev}}</label>
                                </td>
                            </tr>
                            <tr>
                                <td class="div_form_middle_title" style="width: 10%">用户全称：</td>
                                <td class="div_form_middle_other">
                                    <label>{{contractUserEntityVO.userFullname}}</label>
                                </td>
                            </tr>
                            <tr>
                                <td class="div_form_middle_title" style="width: 10%">类型：</td>
                                <td class="div_form_middle_other">
                                    <label data-ng-show="contractUserEntityVO.userType == '1'">机场</label>
                                    <label data-ng-show="contractUserEntityVO.userType == '2'">航司</label>
                                </td>
                            </tr>
                            <tr>
                                <td class="div_form_middle_title" style="width: 10%">责任人：</td>
                                <td class="div_form_middle_other">
                                    <label>{{contractUserEntityVO.personLiable}}</label>
                                </td>
                            </tr>
                            <tr>
                                <td class="div_form_middle_title" style="width: 10%">手机：</td>
                                <td class="div_form_middle_other">
                                    <label>{{contractUserEntityVO.mobilephone}}</label>
                                </td>
                            </tr>
                            <tr>
                                <td class="div_form_middle_title" style="width: 10%">电话：</td>
                                <td class="div_form_middle_other">
                                    <label>{{contractUserEntityVO.telephone}}</label>
                                </td>
                            </tr>
                            <tr>
                                <td class="div_form_middle_title" style="width: 10%">邮件：</td>
                                <td class="div_form_middle_other">
                                    <label>{{contractUserEntityVO.mail}}</label>
                                </td>
                            </tr>
                            <tr>
                                <td class="div_form_middle_title" style="width: 10%">邮编：</td>
                                <td class="div_form_middle_other">
                                    <label>{{contractUserEntityVO.postcode}}</label>
                                </td>
                            </tr>
                            <tr>
                                <td class="div_form_middle_title" style="width: 10%">地址：</td>
                                <td class="div_form_middle_other">
                                    <label>{{contractUserEntityVO.address}}</label>
                                </td>
                            </tr>
                        </table>
                    </div>
                </div>
            </div>

            <!--计费范围-->
            <div class="modal fade" tabindex="-1" role="dialog" id="billingRangeModal">
                <div class="modal-dialog" role="document" style="width: 850px;">
                    <div class="modal-content">
                        <div class="modal-header modal-header-efb">
                            <button type="button" class="close" data-dismiss="modal" aria-label="Close"><span aria-hidden="true">&times;</span></button>
                            <h4 class="modal-title modal-title-efb">计费范围</h4>
                        </div>
                        <div class="modal-body">
                            <div class="row-fluid">
                                <div class="span12">
                                    航司&nbsp;&nbsp;
                                    <input type="checkbox" id="chk_checkAllAirlines" data-ng-click="checkAllAirlines()" />全选&nbsp;&nbsp;
                                    <input type="checkbox" id="chk_inverseCheckAllAirlines" data-ng-click="inverseCheckAllAirlines()" />反选
                                    <div style="width:95%;height:150px;overflow:auto;margin:0 auto;border:1px solid #BBB;margin:10px;overflow-y:scroll;">
                                        <ul style="list-style: none;">
                                            <li style="float:left;width:20%;height:25px;" ng-repeat="airlinesEntityVO in airlinesEntityVOList">
                                                <input type="checkbox" name="airlineIds" value="{{airlinesEntityVO.id}}" ng-checked="{{airlinesEntityVO.checked}}"/>
                                                <span title="{{airlinesEntityVO.chsShortname}}" class="efbtd-nowrap">{{airlinesEntityVO.chsShortname}}</span>
                                            </li>
                                        </ul>
                                    </div>
                                    机场&nbsp;&nbsp;
                                    <input type="checkbox" id="chk_checkAllAirports" data-ng-click="checkAllAirports()" />全选&nbsp;&nbsp;
                                    <input type="checkbox" id="chk_inverseCheckAllAirports" data-ng-click="inverseCheckAllAirports()" />反选
                                    <div style="width:95%;height:150px;overflow:auto;margin:0 auto;border:1px solid #BBB;margin:10px;overflow-y:scroll;">
                                        <ul style="list-style: none;">
                                            <li style="float:left;width:20%;height:25px;" ng-repeat="airportEntityVO in airportEntityVOList">
                                                <input type="checkbox" name="airportIds" value="{{airportEntityVO.id}}" ng-checked="{{airportEntityVO.checked}}"/>
                                                <span title="{{airportEntityVO.airportShortname}}/{{airportEntityVO.airportName}}" class="efbtd-nowrap">{{airportEntityVO.airportShortname}}/{{airportEntityVO.airportNameCut}}</span>
                                            </li>
                                        </ul>
                                    </div>
                                </div>
                            </div>
                        </div>
                        <div class="modal-footer modal-footer-efb">
                            <span data-ng-hide="isSuperAdmin" style="color: #bdc3c7">合同用户无权修改计费范围</span>
                            <button type="button" class="form-btn-edit" data-ng-click="editBillingRange()" data-ng-show="isSuperAdmin">确定</button>
                            <button type="button" class="form-btn-cancel" data-ng-click="closeBillingRangeModal()">取消</button>
                        </div>
                    </div>
                </div>
            </div>

            <!--关联用户-->
            <div class="modal fade" tabindex="-1" role="dialog" id="associatedUsersModal">
                <div class="modal-dialog" role="document" style="width: 800px;">
                    <div class="modal-content">
                        <div class="modal-header modal-header-efb">
                            <button type="button" class="close" data-dismiss="modal" aria-label="Close"><span aria-hidden="true">&times;</span></button>
                            <h4 class="modal-title modal-title-efb">关联用户</h4>
                        </div>
                        <div id="loadsheetstaff" class="modal-body" style="max-height: 605px;overflow: auto">
                            <div class="row-fluid">
                                <div class="span12">
                                    <ul id="associatedUsersTree" class="ztree billingrule_ztree_ul"></ul>
                                </div>
                            </div>
                        </div>
                        <div class="modal-footer modal-footer-efb">
                            <span data-ng-hide="isSuperAdmin" style="color: #bdc3c7">合同用户无权修改关联用户</span>
                            <button type="button" class="form-btn-edit" data-ng-click="editAssociatedUsers()" data-ng-show="isSuperAdmin">确定</button>
                            <button type="button" class="form-btn-cancel" data-ng-click="closeAssociatedUsersModal()">取消</button>
                        </div>
                    </div>
                </div>
            </div>

            <!--计费规则-->
            <div class="modal fade" tabindex="-1" role="dialog" id="billingRuleModal">
                <div class="modal-dialog" role="document" style="width: 500px;">
                    <div class="modal-content">
                        <div class="modal-header modal-header-efb">
                            <button type="button" class="close" data-dismiss="modal" aria-label="Close"><span aria-hidden="true">&times;</span></button>
                            <h4 class="modal-title modal-title-efb">计费规则</h4>
                        </div>
                        <div class="modal-body">
                            <div class="row-fluid">
                                <div class="span12">
                                    <div style="width:95%;height:300px;overflow:auto;margin:0 auto;border:1px solid #BBB;margin:10px;overflow-y:scroll;">
                                        <ul style="list-style: none;">
                                            <li style="float:left;width:90%;height:30px;" ng-repeat="billingRuleEntityVO in billingRuleEntityVOList">
                                                <input type="radio" name="billingRuleIds" value="{{billingRuleEntityVO.billingRuleId}}" ng-checked="{{billingRuleEntityVO.checked}}"/>
                                                <span title="{{billingRuleEntityVO.ruleAbbrev}}" class="efbtd-nowrap" style="width: 300px;">{{billingRuleEntityVO.ruleAbbrev}}</span>
                                            </li>
                                        </ul>
                                    </div>
                                </div>
                            </div>
                        </div>
                        <div class="modal-footer modal-footer-efb">
                            <span data-ng-hide="isSuperAdmin" style="color: #bdc3c7">合同用户无权修改计费规则</span>
                            <button type="button" class="form-btn-edit" data-ng-click="editBillingRule()" data-ng-show="isSuperAdmin">确定</button>
                            <button type="button" class="form-btn-cancel" data-ng-click="closeBillingRuleModal()">取消</button>
                        </div>
                    </div>
                </div>
            </div>

            <!--外部容器的DIV随着内部DIV增多而增加高度-->
            <div style="clear:both;"></div>
        </div>
    </div>
</div>
<!--通用尾部-->
<div th:replace="footer::footer" ></div>
<!--js引用：只写自己需要的js-->
<link rel="stylesheet" type="text/css" th:href="@{/zTree/zTreeStyle.css}"/>
<link rel="stylesheet" type="text/css" th:href="@{/css/billingrule.css}"/>

<script type="text/javascript" th:src="@{/js/contractUser/ContractUserModule.js}"></script>
<script type="text/javascript" th:src="@{/js/common/cookieUtil.js}"></script>
<script type="text/javascript" th:src="@{/js/contractUser/ContractUserService.js}"></script>
<script type="text/javascript" th:src="@{/js/contractUser/ContractUserController.js}"></script>

<script type="text/javascript" th:src="@{/zTree/jquery.ztree.core-3.5.js}"></script>
<script type="text/javascript" th:src="@{/zTree/jquery.ztree.excheck-3.5.js}"></script>
<script type="text/javascript" th:src="@{/zTree/jquery.ztree.exedit.js}"></script>
<script type="text/javascript" th:src="@{/zTree/highlight.min.js}"></script>
<script type="text/javascript" th:src="@{/zTree/jQuery-contextMenujstheme.js}"></script>
<script type="text/javascript" th:src="@{/zTree/Query-contextMenudistjquery.contextMenu.js}"></script>
<script type="text/javascript" th:src="@{/zTree/jQuery-contextMenudistjquery.ui.position.min.js}"></script>
<script type="text/javascript" th:src="@{/zTree/jQuery-contextMenujsmain.js}"></script>

</body>
</html>